<template>
<!-- :value="value" 把父组件的频道ID赋值给下拉框,显示对应的频道 -->
 <div>
    <el-select clearable :value="value" placeholder="请选择" @change="changeChannel">
    <el-option
      v-for="item in channelOptions"
      :key="item.id"
      :label="item.name"
      :value="item.id"
    >
    </el-option>
  </el-select>
 </div>
</template>
<script>
export default {
  name: "MyChannel",
  // 接收父组件的频道ID,只读
  props: ["value"],
  data() {
    return {
      //选中的频道id
    //  channelId: null,
      //频道选项
      channelOptions: [],
    };
  },
  created() {
    //获取频道数据
    this.getChannelOptions();
  },
  methods: {
    async getChannelOptions() {
      const res = await this.$http.get("/v1_0/channels");
      this.channelOptions = res.data.data.channels;
    },
    changeChannel(channelId){
      //子组件传递频道ID给父组件
     // console.log(channelId);
     this.$emit('input',channelId)
    }
  },
};
</script>
<style scoped lang="less"></style>
